<!DOCTYPE html>
<html lang="en">
<head>
    <!--    Author 卢元庆-->
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>good</title>
    <link rel="stylesheet" type="text/css" href="https://www.layuicdn.com/layui/css/layui.css"/>
</head>
<body>
<!--需要使用表格加载数据-->
<!--TODO 搜索框 -->
<table class="layui-hide" id="demo" lay-filter="good"></table>
<script src="https://www.layuicdn.com/layui/layui.js"></script>
<script>
    layui.use('table', function () {
        var table = layui.table
        var $ = layui.jquery
        //执行一个 table 实例
        var tab = table.render({
            elem: '#demo',
            height: 312,
            url: '/tingche/role/all',
            title: '角色表',
            limit: 2,
            loading: 'true',
            page: true,//开启分页
            // toolbar: 'default', //开启工具栏，此处显示默认图标，可以自定义模板，详见文档
            totalRow: false, //开启合计行
            //表头
            cols: [
                [{
                    fixed: 'left',
                    type: 'checkbox'
                },
                    {
                        field: 'roleId',
                        title: '角色ID',
                        width: 80
                    },
                    {
                        field: 'degree',
                        title: '角色等级',
                        width: 120,
                        sort: true
                    },
                    /*                    {
                                            field: 'count',
                                            title: '拥有人数',
                                            width: 100
                                        },*/
                    {
                        field: 'description',
                        title: '角色描述'
                    },
                    /*                    {
                                            fixed: 'right',
                                            width: 165,
                                            align: 'center',
                                            toolbar: '#barDemo'
                                        }*/
                ]
            ]
        });

        $("#search").on('click', function () {
            tab.reload({
                url: '/tingche/all', where: {}, page: {curr: 1}
            })
        });

        //监听头工具栏事件
        table.on('toolbar(good)', function (obj) {
            //获取选中的行  复选框   数据    功能按钮
            var checkStatus = table.checkStatus(obj.config.id),
                data = checkStatus.data; //获取选中的数据
            // 获取到了需要操作的数据
            switch (obj.event) {
                case 'add':
                    layer.msg('执行一个入操作');
                    break;
                case 'update':
                    if (data.length === 0) {
                        layer.msg('执行编辑功能');
                    } else if (data.length > 1) {
                        layer.msg('只能同时编辑一个');
                    } else {
                        layer.alert('编辑 [id]：' + checkStatus.data[0].id);
                    }
                    break;
                case 'delete':
                    if (data.length === 0) {
                        layer.msg('执行删除功能');
                    } else {
                        layer.msg('删除');
                    }
                    break;
            }

        });

    })
</script>
</body>
</html>